<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ~ Copyright (c) 2019-2022 Contributors to the Eclipse Foundation
  ~
  ~ See the NOTICE file(s) distributed with this work for additional
  ~ information regarding copyright ownership.
  ~
  ~ This program and the accompanying materials are made available under the
  ~ terms of the Eclipse Public License 2.0 which is available at
  ~ http://www.eclipse.org/legal/epl-2.0, or the Apache Software License 2.0
  ~ which is available at https://www.apache.org/licenses/LICENSE-2.0.
  ~
  ~ SPDX-License-Identifier: EPL-2.0 OR Apache-2.0
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<h3>Configure the visibility of the following features:</h3>

<div class="form-group">
    <label class="control-label" for="containerUrl2">Modeler URL</label>
    <input id="containerUrl2"
           class="form-control"
           type="text"
           name="containerUrl2"
           autocomplete=off
           required
           (ngModelChange)="checkModelerAvailability()"
           (ended)="checkModelerAvailability()"
           [formControl]="containerUrlControl"
           [ngStyle]="{'border-color':containerUrlAvailable ?  'green' : 'red'}"
    />
    <span *ngIf="containerUrlAvailable"><i class="fa fa-check"></i></span>
    <span *ngIf="!containerUrlAvailable"><i class="fa fa-times"></i></span>
    <button class="btn btn-info btn-xs" (click)="saveModelerURL()">Save</button>
</div>

<div class="form-group">
    <input type="checkbox" [(ngModel)]="config.features.accountability" id="accountability" name="accountability"
           [checked]="config.features.accountability">
    <label for="accountability">Accountability</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.completion" id="completion" name="completion"
           [checked]="config.features.completion">
    <label for="completion">Completion</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.compliance" id="compliance"
           name="compliance" [checked]="config.features.compliance">
    <label for="compliance">Compliance</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.freezeAndDefrost" id="freeze" name="freeze"
           [checked]="config.features.freezeAndDefrost">
    <label for="freeze">Freeze and Defrost</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.managementFeatureEnrichment" id="managementFeatureEnrichment"
           name="managementFeatureEnrichment"
           [checked]="config.features.managementFeatureEnrichment">
    <label for="managementFeatureEnrichment">Management Feature Enrichment</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.patternRefinement" id="patternRefinement"
           name="patternRefinement"
           [checked]="config.features.patternRefinement">
    <label for="patternRefinement">Pattern Refinement</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.topologyFragmentRefinementModel"
           id="topologyFragmentRefinementModel"
           name="topologyFragmentRefinementModel"
           [checked]="config.features.topologyFragmentRefinementModel">
    <label for="topologyFragmentRefinementModel">Topology Fragment Refinement</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.problemDetection" id="problemDetection" name="problemDetection"
           [checked]="config.features.problemDetection">
    <label for="problemDetection">Problem Detection</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.splitting" id="splitting" name="splitting"
           [checked]="config.features.splitting">
    <label for="splitting">Splitting</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.multiParticipant" id="multiParticipant" name="multiParticipant"
           [checked]="config.features.multiParticipant">
    <label for="multiParticipant">Multi-Participant Support</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.testRefinement" id="testRefinement" name="testRefinement"
           [checked]="config.features.testRefinement">
    <label for="testRefinement">Test Refinement</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.edmmModeling" id="edmmModeling" name="edmmModeling"
           [checked]="config.features.edmmModeling">
    <label for="edmmModeling">EDMM Modeling</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.instanceModelRefinement" id="instanceModelRefinement"
           name="instanceModelRefinement"
           [checked]="config.features.instanceModelRefinement">
    <label for="instanceModelRefinement">Instance Modeling</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.liveModeling" id="liveModeling" name="liveModeling"
           [checked]="config.features.liveModeling">
    <label for="liveModeling">Live Modeling</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.propertyCheck" id="propertyCheck" name="propertyCheck"
           [checked]="config.features.propertyCheck">
    <label for="propertyCheck">Property Check</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.updateTemplates" id="updateTemplates" name="updateTemplates"
           [checked]="config.features.updateTemplates">
    <label for="updateTemplates">Show update Notifications</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.placement" id="componentPlacement" name="componentPlacement"
           [checked]="config.features.placement">
    <label for="componentPlacement">Component Placement</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.cloudAllocation" id="cloudAllocation" name="cloudAllocation"
           [checked]="config.features.cloudAllocation">
    <label for="componentPlacement">Cloud Allocation</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.radon" id="radon" name="radon"
           [checked]="config.features.radon">
    <label for="radon">RADON</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.patternDetection" id="patternDetection"
           name="patternDetection"
           [checked]="config.features.patternDetection">
    <label for="patternDetection">Pattern Detection</label>
    <br>
    <input type="checkbox" [(ngModel)]="config.features.researchObject" id="researchObject" name="researchObject"
           [checked]="config.features.researchObject">
    <label for="researchObject">Research Object</label>
    <input *ngIf="config.features.researchObject" id="daRusURL" class="form-control"
           type="text" [(ngModel)]="config.darus.server"
           placeholder="DaRUS Server URL">
    <input *ngIf="config.features.researchObject" id="daRusApiToken" class="form-control"
           type="text" [(ngModel)]="config.darus.apiToken"
           placeholder="DaRUS API Token">
    <input *ngIf="config.features.researchObject" id="daRusDataverse" class="form-control"
           type="text" [(ngModel)]="config.darus.dataverse"
           placeholder="DaRUS Dataverse">
    <br>
    <input type="checkbox" [(ngModel)]="config.features.normalization" id="deploymentModelNormalizer"
           name="patternDetection"
           [checked]="config.features.normalization">
    <label for="deploymentModelNormalizer">Deployment-Model Normalization</label>
    <input *ngIf="config.features.normalization" id="deploymentModelNormalizerURL" class="form-control"
           type="text" [(ngModel)]="config.endpoints.deploymentNormalizationAssistant"
           placeholder="Deployment Model Analyzer URL">
    <br>
    <input type="checkbox" [(ngModel)]="config.features.licenseEngine" id="licenseEngine"
           name="licenseEngine"
           [checked]="config.features.licenseEngine">
    <label for="licenseEngine">License Engine</label>
    <input *ngIf="config.features.licenseEngine" id="licenseEngineURL" class="form-control"
           type="text" [(ngModel)]="config.endpoints.licenseEngine"
           placeholder="License Engine URL">
</div>
<div>
    <button class="btn btn-primary" (click)="saveChanges()">Save Changes</button>
</div>
